<template>
  <div class="common-layout" style="width: 100%;height: 100%">
    <el-container style="width: 100%;height: 100%">
      <el-header height="75px">
        <el-row :gutter="20">
          <el-col :span="16">
            <div style="font-size:22px;line-height: 2;font-family: Alibaba PuHuiTi-Medium">盐城市城管局智慧监管平台
            </div>
          </el-col>
          <el-col :span="8"></el-col>
        </el-row>
      </el-header>
      <el-container>
        <el-aside width="205px">
          <menuBar></menuBar>
        </el-aside>
        <el-container>
          <el-main>
            <router-view/>
          </el-main>
<!--          <el-footer>Footer</el-footer>-->
        </el-container>
      </el-container>
    </el-container>
  </div>
</template>

<script>
import {reactive, toRefs, onMounted} from 'vue'
import {useRoute, useRouter} from 'vue-router'
import {useStore} from 'vuex'
import menuBar from '../components/common/MenuBar'

export default {
  name: "index",
  components: {
    menuBar,
  },
  setup() {
    const Route = useRoute()
    const Router = useRouter()
    const store = useStore()
    const state = reactive({

    })


    onMounted(() => {


    })

    return {
      ...toRefs(state),

    }
  },
}
</script>

<style lang='less' scoped>

.header {
  background-color: white;
}
</style>
